<template>
    <h1>VUE v-model</h1>

    <!-- <input type="text" v-model="msg" /> -->
    <!-- <input type="text" :value="msg" @input="setMsg" /> -->
    
    <!-- .number 将输入的 字符串类型的数字, 转换为 数字类型 -->
    <!-- <input type="text" v-model.number="msg" /> -->
    <!-- .lazy 将默认的 input 事件 更改为 change -->
    <!-- <input type="text" v-model.lazy="msg" /> -->
    <!-- .trim 去掉左右两边的空格 -->
    <!-- <input type="text" v-model.trim="msg" /> -->
    
    <h1>{{ msg }}</h1>
</template>

<script>
export default {
    data() {
        return {
            msg: "初识默认值",
        };
    },
    methods: {
        setMsg (e) {
            this.msg = e.target.value
        }
    }
};
</script>

<style></style>
